<template>
  <div>
    <at-form ref="form" :model="form" label-width='120px' :rules="rules">
        <at-form-item label="风险事项名称" prop="riskname">
        	<at-input v-model="form.riskname"></at-input>
      	</at-form-item>
        <at-form-item label="风险事项类型" prop = "risktype" >
          <at-select  v-model = "form.risktype" plceholder="标志为">
            <at-option
              v-for="item in risktype"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </at-option>
          </at-select>
        </at-form-item>
		    <at-form-item label="风险事项等级" prop="risklevel" >
          <at-select  v-model = "form.risklevel" plceholder="标志为">
            <at-option
              v-for="item in risklevel"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </at-option>
          </at-select>
        </at-form-item>
          <at-form-item label="风险事项描述" prop="riskdescribe">
              <at-input v-model="form.riskdescribe" placeholder="高度自适应，有最小高度和最大高度" type="textarea" :autosize="{ minRows: 4, maxRows: 8}"/>
          </at-form-item>
	      <at-form-item>
			    <at-button type="primary" @click="submitForm('form')">修改</at-button>
			    <at-button @click="resetForm('form')">取消</at-button>
			  </at-form-item>
    </at-form>
  </div>
</template>
<script>
import { mapState } from 'vuex'
export default {
  name: 'AddRisk',
  data () {
    var namerepetition = (rule, value, callback) => {
      if (value !== this.risk_event_name) {
        if (value === '') {
          callback(new Error('请输入风险事项名称'))
        } else {
          let DataValidation = function (value) {
            if (value === 'success') {
              callback()
            } else {
              callback(new Error('风险事项名称重复'))
            }
          }
          this.$store.dispatch('riskEvents/addrisk', { 'value': value, 'DataValidation': DataValidation })
        }
      } else {
        callback()
      }
    }
    return {
      risktype: [{
        value: '新兴',
        label: '新兴'
      }, {
        value: '流行',
        label: '流行'
      }, {
        value: '高危',
        label: '高危'
      }],
      risklevel: [{
        value: 4,
        label: '特大'
      }, {
        value: 3,
        label: '重大'
      }, {
        value: 2,
        label: '较大'
      }, {
        value: 1,
        label: '一般'
      }],
      rules: {
        riskname: {validator: namerepetition, trigger: 'blur', required: true},
        risktype: {trigger: 'blur', required: true, message: '请选择风险事项类型'},
        risklevel: {required: true, message: '请选择风险事项等级'},
        riskdescribe: {trigger: 'blur', required: true, message: '请输入风险事项描述'}
      },
      derailsData: []
    }
  },
  watch: {
    $route (to, from) {
      // console.log(to.name)
      if (to.name === '编辑风险事项') {
        this.$store.dispatch('riskEventsDerails/InitialValue', {data: {'id': this.$route.query.id}, fun: this.setitem})
      }
    }
  },
  created () {
    this.$store.dispatch('riskEventsDerails/InitialValue', {data: {'id': this.$route.query.id}, fun: this.setitem})
  },
  props: {
    closetabs: { type: Function }
  },
  computed: {
    ...mapState({
      risk_event_name: state => state.riskEvents.risk_event_name,
      form: state => state.riskEvents.form
    })
    // status: {
    //   get () {
    //     return this.$store.state.riskEvents.status
    //   },
    //   set (val) {
    //     this.status = val
    //   }
    // }
  },
  methods: {
    setitem (item, value) {
      this[item] = value
    },
    submitForm (formName) {
      this.$refs[formName].validate((valid) => {
        let router = '/web/riskEvents/editrisk?id=' + this.$route.query.id

        if (valid) {
          let data = JSON.parse(JSON.stringify(this.form))
          this.$store.dispatch('riskEvents/riskData/edit', data)

          this.$router.push('/web/riskEvents')
          // console.log('/web/riskEvents/editrisk?id=' + _this.$route.query.id)
          this.closetabs(router, 'remove') // 关闭 接口
        } else {
          return false
        }
      })
    },
    resetForm (formName) {
      this.$refs[formName].resetFields()
      let router = '/web/riskEvents/editrisk?id=' + this.$route.query.id
      this.$router.push('/web/riskEvents')
      this.closetabs(router, 'remove')
      // console.log(this.$route.params.id)
    }
  }
}
</script>